<template>
  <div>
    <!--    <el-button type="primary" @click="test">click</el-button>-->

    <!--    <el-cascader-->

    <!--        style="margin-left: 10px; width: 255px"-->
    <!--        placeholder="请选择单位"-->
    <!--        ref="dwref"-->
    <!--        v-model="dwval"-->
    <!--        @change="dwchange"-->
    <!--        :options="dwoptions"-->
    <!--        :props="{ expandTrigger: 'hover', checkStrictly: true, label: 'dwname', value:'id' }"-->
    <!--        clearable></el-cascader>-->


    <el-container>
      <el-aside class="operation_box" width="300px"
                style="margin-top: 0px; margin-left: 0px; border-right: 1px solid #ddd;">


        <!--        <el-input-->

        <!--            placeholder="输入关键字进行过滤"-->
        <!--            v-model="filterText">-->
        <!--        </el-input>-->

        <!--        :props="defaultProps"--><!--          default-expand-all  -->
        <el-tree
            class="tree"
            style="margin-top: 0px;"
            :data="dwoptions"
            node-key="id"
            :expand-on-click-node="false"
            :highlight-current="true"
            @current-change="currentchange2"
            :props="{  label: 'dwname' }"
            :default-expanded-keys="dwtree_expand_keys"
            @node-expand="handleExpand"
            @node-collapse="handleCollapse"
            ref="tree">
        </el-tree>

      </el-aside>
      <el-container style="margin-left: 0px">

        <el-main>
          <div>
            <el-select style="margin-left: 0px" v-model="devtype" clearable placeholder="请选择设备类型" filterable
                       @change="devtypechange">
              <el-option
                  v-for="item in devtypeArr"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id">
              </el-option>
            </el-select>

            <el-input style="width: 200px; margin: 0 20px" placeholder="请输入设备名" suffix-icon="el-icon-search"
                      v-model="name"/>

            <el-button type="primary" @click="search">搜索</el-button>
            <el-popconfirm
                title="确定要批量业务吗？"
                @confirm="sendBatchYewu">
              <el-button round icon="el-icon-warning-outline" type="primary" style="margin: 10px 80px"
                         slot="reference">
                批量设置新值
              </el-button>
            </el-popconfirm>
            <el-button round icon="el-icon-refresh" type="primary" style="margin: 10px 20px"
                       slot="reference" @click="refreshAll">
              刷新当前值
            </el-button>

            <!--            <el-button round icon="el-icon-warning-outline" type="primary" style="margin: 10px 80px"-->
            <!--                       @click="showBatchYewuForm">-->
            <!--              批量业务-->
            <!--            </el-button>-->

            <el-dialog width="50%" title="批量业务" :visible.sync="batchYewuFormVisible">
              <el-form :model="batchYewuForm" label-width="150px" :rules="batchYewuFormRules" ref="batchYewuForm">
                <el-form-item label="业务类型" prop="yewutypeid">
                  <el-select v-model="batchYewuForm.yewutypeid" placeholder="请选择" @change="batchyewuChange"
                             clearable>
                    <el-option
                        v-for="item in batchYewuForm.yewutypeArr"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                    </el-option>
                  </el-select>
                  {{ tishi }}
                </el-form-item>
                <el-form-item label="业务内容（开关量）" prop="bvalue" v-show="batchYewuForm.bVisible">
                  <el-switch
                      v-model="batchYewuForm.bvalue"
                      active-color="#13ce66"
                      inactive-color="#ff4949">
                  </el-switch>
                </el-form-item>
                <el-form-item label="业务内容（模拟量）" prop="content" v-show="batchYewuForm.contentVisible">
                  <el-input type="text" v-model="batchYewuForm.content" placeholder="请输入设定值"></el-input>
                </el-form-item>
              </el-form>

              <div slot="footer" class="dialog-footer">
                <el-button @click="batchYewuFormVisible = false">关 闭</el-button>
                <el-button type="primary" @click="batchyewu()">发送命令</el-button>
              </div>
            </el-dialog>

            <el-dialog width="50%" title="功能业务" :visible.sync="YewuFormVisible">
              <el-form :model="YewuForm" label-width="150px" :rules="YewuFormRules" ref="YewuForm">
                <el-form-item label="业务" prop="yewuid">
                  <el-select v-model="YewuForm.yewuid" placeholder="请选择" @change="yewuChange" clearable>
                    <el-option
                        v-for="item in YewuForm.yewuArr"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                    </el-option>
                  </el-select>
                  {{ tishi }}
                </el-form-item>

                <el-form-item label="业务内容（开关量）" prop="bvalue" v-show="YewuForm.bVisible">
                  <el-switch
                      v-model="YewuForm.bvalue"
                      active-color="#13ce66"
                      inactive-color="#ff4949">
                  </el-switch>
                </el-form-item>
                <el-form-item label="业务内容（模拟量）" prop="content" v-show="YewuForm.contentVisible">
                  <el-input type="text" v-model="YewuForm.content" placeholder="请输入设定值"></el-input>
                </el-form-item>
              </el-form>

              <div slot="footer" class="dialog-footer">
                <el-button @click="YewuFormVisible = false">关 闭</el-button>
                <el-button type="primary" @click="yewu()">发送命令</el-button>
              </div>
            </el-dialog>

            <el-table ref="table" @selection-change="handleSelectionChange" :data="tableData"
                      style="margin: 0px; width: 1300px; " border stripe :span-method="arraySpanMethod">
              <el-table-column width="50" type="selection">
              </el-table-column>
              <el-table-column prop="id" label="ID" width="60" v-if="false">
              </el-table-column>
              <el-table-column sortable prop="name" label="设备名" width="120">
                <template slot-scope="scope">
                  <router-link :to="'/dev/reg?id='+scope.row.id" slot="reference" style="color: #20a0ff">{{
                      scope.row.name
                    }}
                  </router-link>
<!--                  <el-popover-->
<!--                      @show="showpop(scope.row)"-->
<!--                      placement="right"-->
<!--                      width="400"-->
<!--                      trigger="hover">-->
<!--                    <el-table :data="scope.row.regList">-->
<!--                      <el-table-column width="150" property="name" label="业务名"></el-table-column>-->
<!--                      <el-table-column width="100" property="" label="当前值">-->
<!--                        <template slot-scope="scope">-->
<!--                          <span v-if="scope.row.regtype==0 || scope.row.regtype==1">-->
<!--                            <span v-if="scope.row.bvalue==0">关</span>-->
<!--                            <span v-if="scope.row.bvalue==1">开</span>-->
<!--                          </span>-->
<!--                          <span v-if="scope.row.regtype==3 || scope.row.regtype==4">-->
<!--                            {{ scope.row.nvalue }}-->
<!--                          </span>-->

<!--                        </template>-->
<!--                      </el-table-column>-->
<!--                    </el-table>-->
<!--                    <el-button size="mini" slot="reference" style="float:right; color: #20a0ff">业务详情-->
<!--                    </el-button>-->
<!--                  </el-popover>-->
                </template>
              </el-table-column>
              <el-table-column prop="ip" label="IP" width="180" v-if="false">
              </el-table-column>
              <el-table-column sortable prop="dwObj.dwname" label="所属单位" width="150">
              </el-table-column>
              <el-table-column sortable prop="devtypeObj.name" label="设备类型" width="150">
              </el-table-column>

              <!--              <el-table-column prop="#" label="业务">-->
              <!--                <template slot-scope="scope">-->

              <!--                  <el-button round type="primary" icon="el-icon-cpu" @click="showYewuForm(scope.row)">业务管理-->
              <!--                  </el-button>-->

              <!--                </template>-->
              <!--              </el-table-column>-->
              <el-table-column prop="#" label="选择业务" width="200">
                <!--                <template slot-scope="scope">-->
                <!--                  <el-select round type="primary" icon="el-icon-cpu">业务管理-->
                <!--                  </el-select>-->
                <!--                </template>-->
                <template slot-scope="scope">
                  <el-select v-model="scope.row.yewusel" placeholder="请选择" @change="refreshyewu(scope.row)"
                             clearable style="width: 120px; margin-right: 15px">
                    <el-option
                        v-for="item in scope.row.regList"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                    </el-option>
                  </el-select>
                  <el-popover
                      @show="showpop(scope.row)"
                      placement="right"
                      width="400"
                      trigger="hover"
                      :open-delay="1000"
                  >
                    <el-table :data="scope.row.regList">
                      <el-table-column width="150" property="name" label="业务名"></el-table-column>
                      <el-table-column width="100" property="" label="当前值">
                        <template slot-scope="scope">
                          <span v-if="scope.row.regtype==0 || scope.row.regtype==1">
                            <span v-if="scope.row.bvalue==0">关</span>
                            <span v-if="scope.row.bvalue==1">开</span>
                          </span>
                          <span v-if="scope.row.regtype==3 || scope.row.regtype==4">
                            {{ scope.row.nvalue }}
                          </span>
                        </template>
                      </el-table-column>
                    </el-table>
                    <el-button size="mini" slot="reference" style="display: inline-block;" type="text">详情
                    </el-button>
                  </el-popover>
<!--                  <el-button size="mini"  style="display: inline-block;">业务详情-->
<!--                  </el-button>-->

                </template>
              </el-table-column>
              <el-table-column v-if="false" sortable prop="#" label="值类型" width="130">
                <template slot-scope="scope">
                  <span v-if="scope.row.valtype == 1">开关量</span>
                  <span v-if="scope.row.valtype == 2">16位无符号整数</span>
                  <span v-if="scope.row.valtype == 3">16位整数</span>
                  <span v-if="scope.row.valtype == 4">32位无符号整数</span>
                  <span v-if="scope.row.valtype == 5">32位整数</span>
                  <span v-if="scope.row.valtype == 8">32位float</span>
                </template>
              </el-table-column>
              <el-table-column sortable prop="#" label="当前值" width="150">

                <template slot-scope="scope">
                  <div v-if="scope.row.getvalstate==1"
                       style="display: inline-block; width: 20px; height: 20px; background-color: red; border-radius: 50% "></div>
                  <span v-if="scope.row.valtype == 1">
                    <span v-if="scope.row.bvalue == 1">开</span>
                    <span v-if="scope.row.bvalue == 0">关</span>
                  </span>
                  <span v-if="scope.row.valtype == 2">{{ scope.row.nvalue }}</span>
                  <span v-if="scope.row.valtype == 3">{{ scope.row.nvalue }}</span>
                  <span v-if="scope.row.valtype == 4">{{ scope.row.nvalue }}</span>
                  <span v-if="scope.row.valtype == 5">{{ scope.row.nvalue }}</span>
                  <span v-if="scope.row.valtype == 8">{{ scope.row.nvalue }}</span>

                  <el-button style="display: inline-block; float: right" size="mini" type="text"
                             @click="refreshyewu(scope.row)">刷新
                  </el-button>
                </template>
              </el-table-column>
              <el-table-column sortable prop="#" label="设置新值" width="240">
                <template slot-scope="scope">
                  <el-popconfirm
                      confirm-button-text='确定'
                      cancel-button-text='取消'
                      icon="el-icon-info"
                      icon-color="red"
                      title="确定发送命令吗？"
                      @confirm="sendyewu(scope.row)"
                  >
                    <el-button  size="mini" type="primary" icon="el-icon-cpu" slot="reference"
                               :disabled="scope.row.isButtonDisabled">设置
                    </el-button>
                  </el-popconfirm>
                  <el-input style="width: 120px; margin-left: 15px" :ref="scope.row.id+scope.row.name" v-if="scope.row.regtype == 4"
                            v-model="scope.row.newnvalue"
                            :placeholder="scope.row.valtype==2? '16位无符号数':(scope.row.valtype==3? '16位整数':(scope.row.valtype==4?'32位无符号整数':(scope.row.valtype==5?'32位整数':(scope.row.valtype==8?'32位float':'lala'))))"
                            :class="{ 'blink-border': scope.row.inputerrblink }"></el-input>
                  <el-switch style="width: 120px; margin-left: 15px"
                      v-if="scope.row.regtype == 0"
                      v-model="scope.row.newbvalue"
                      active-color="#13ce66"
                      inactive-color="#ff4949">
                  </el-switch>


                </template>
              </el-table-column>
              <el-table-column v-if="false" prop="#" label="操作">
                <template slot-scope="scope">
                  <el-popconfirm
                      confirm-button-text='确定'
                      cancel-button-text='取消'
                      icon="el-icon-info"
                      icon-color="red"
                      title="确定发送命令吗？"
                      @confirm="sendyewu(scope.row)"
                  >
                    <el-button size="mini" type="primary" icon="el-icon-cpu" slot="reference"
                               :disabled="scope.row.isButtonDisabled">设置
                    </el-button>
                  </el-popconfirm>
                  <!--                  <el-popconfirm-->
                  <!--                      confirm-button-text='确定'-->
                  <!--                      cancel-button-text='取消'-->
                  <!--                      icon="el-icon-info"-->
                  <!--                      icon-color="red"-->
                  <!--                      title="确定发送命令吗？"-->
                  <!--                      @confirm="sendyewu(scope.row)"-->
                  <!--                  >-->
                  <!--                    <el-button size="mini" type="primary" icon="el-icon-cpu" slot="reference" :disabled="true">发送-->
                  <!--                    </el-button>-->
                  <!--                  </el-popconfirm>-->
                </template>
              </el-table-column>
              <el-table-column  prop="#" label="">
                <template slot-scope="scope">

                  <!--                  <el-result  v-if="scope.row.result == 0"  icon="success" title="成功">-->
                  <!--                  </el-result>-->
                  <span v-if="scope.row.result == 0" style="color: green">
                    <el-icon color="green" class="el-icon-success"></el-icon>操作成功</span>
                  <span :ref="scope.row.id+scope.row.name+'span'" style="color: red;cursor: pointer"
                        v-if="scope.row.result == 1" :class="{ 'blink-text': scope.row.errmessageblink}"
                        @click="$alert(scope.row.errormessage)">
                    <el-icon color="green" class="el-icon-error"></el-icon>失败,点击查看详情</span>
                </template>
              </el-table-column>
            </el-table>
            <!--            <div>-->
            <!--              <el-button round icon="el-icon-warning-outline" type="danger" style="margin: 10px"-->
            <!--                         @click="showbathTjConfirmForm">-->
            <!--                批量停机-->
            <!--              </el-button>-->
            <!--            </div>-->

            <div class="block" style="padding: 5px">
              <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[10, 20, 50, 100,500,1000]"
                  :page-size="pageSize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="total">
              </el-pagination>
            </div>
          </div>
        </el-main>

      </el-container>
    </el-container>

  </div>

</template>
<script>
import service from "@/utils/request";
import ElementUI from "element-ui";

import VueRouter from 'vue-router'
import HomeView from "@/views/HomeView.vue";


export default {
  created() {
    service.get('/dw/getAll', {}).then(
        response => {
          if (response.data.code == 20000) {
            this.dwoptions = response.data.data
          } else {
            this.$message.error(response.data.message)
          }
        }, error => {
          ElementUI.Message({
            message: error.message,
            type: 'error'
          })
        }
    )
    service.get('/devtype/getAll', {}).then(
        response => {
          if (response.data.code == 20000) {
            this.devtypeArr = response.data.data;
          } else {
            this.$message.error(response.data.message)
          }
        }, error => {
          ElementUI.Message({
            message: error.message,
            type: 'error'
          })
        }
    )
    this.load();
  },
  data() {
    return {
      tishi: null,
      gxArr: [],
      gx: null,

      YewuFormRules: {
        yewuid: [
          {required: true, message: '请输入', trigger: 'blur'},

        ],
        content: [
          {required: true, message: '请输入值', trigger: 'blur'},

        ]
      },

      batchYewuFormRules: {
        yewutypeid: [
          {required: true, message: '请输入', trigger: 'blur'},

        ],
        content: [
          {required: true, message: '请输入值', trigger: 'blur'},

        ]
      },


      dwoptions: [],
      dwval: [],
      dwtree_expand_keys: [1],

      name: '',
      devtype: null,
      devtypeArr: [],
      tableData: [],
      selectedRows: [], // 用来存储选中行的数据
      pageSize: 10,
      total: 100,
      currentPage: 1,
      // dialogFormVisible: false,
      YewuFormVisible: false,
      batchYewuFormVisible: false,
      // batchstopConfirmdialogFormVisible:false,
      // form: {
      //   username: '',
      //   password: '',
      //   roleId: '',
      // },
      YewuForm: {
        devid: null,
        yewuid: null,
        yewuArr: [],
        content: null, //模拟量的值，
        bvalue: null, //开关量的值
        bVisible: null, //开关量值控件是否显示
        contentVisible: null //模拟量值控件是否显示
      },

      batchYewuForm: {
        // devid: null,
        // yewuid: null,
        yewutypeid: null,
        yewutypeArr: [],
        content: null, //模拟量的值，
        bvalue: null, //开关量的值
        bVisible: null, //开关量值控件是否显示
        contentVisible: null //模拟量值控件是否显示
      },
      // stopform: {
      //   id: null,
      //   jh: '',
      //   ip: '',
      //   dw: ''
      // },
      formLabelWidth: '120px'
    }
  },
  methods: {
    test() {
      console.log(this.treeval)
      // service.get('/dj/test', {}).then(
      //     response => {
      //       if (response.data.code == 20000) {
      //
      //         this.$message.success(response.data.message)
      //       }
      //     }
      // )

    },

    load() {
      service.get('/dev/getpage', {
        params: {
          dwid: this.dwval,
          devtype: this.devtype,
          devname: this.name,
          pagesize: this.pageSize,
          pagenum: this.currentPage,
        }
      }).then(response => {
            if (response.data.code == 20000) {
              this.tableData = response.data.data.records;
              this.total = response.data.data.total;
              this.currentPage = response.data.data.current;
              this.pageSize = response.data.data.size;
              //通过this.$set添加列，使得这些属性具有确保响应式更新，否则这些属性不具有响应式更新的功能，也就是没有get，set方法
              //这些属性用于用户操作表格某行的时候的选择及输入的数据交互，及操作结果的显示
              for (let i = 0; i < this.tableData.length; i++) {
                this.$set(this.tableData[i], 'nvalue', null) //设备的老的number值
                this.$set(this.tableData[i], 'bvalue', null)//设备的老的number值
                this.$set(this.tableData[i], 'regdatatp', null)//用户选择的regdatatp新值
                this.$set(this.tableData[i], 'regtype', null) // 用户选择的regtype新值
                this.$set(this.tableData[i], 'result', null) // 用户操作后的结果是否成功，result：0成功，1失败
                this.$set(this.tableData[i], 'errormessage', null) //用户操作后的结果失败后的错误信息
                this.$set(this.tableData[i], 'newbvalue', null) //用户输入的bool新值
                this.$set(this.tableData[i], 'newnvalue', null) // 用户输入的number新值
                this.$set(this.tableData[i], 'inputerrblink', false) //input框出错后的闪烁控制，true闪烁，false不闪烁
                this.$set(this.tableData[i], 'errmessageblink', false) //错误文本信息提示闪烁控制，true闪烁，false不闪烁
                this.$set(this.tableData[i], 'getvalstate', null) //获取当前值的状态 0，正常，1出错
                this.$set(this.tableData[i], 'isButtonDisabled', true) //isButtonDisabled
                for (let j = 0; j < this.tableData[i].regList.length; j++) {
                  this.$set(this.tableData[i].regList[j], 'nvalue', null)
                  this.$set(this.tableData[i].regList[j], 'bvalue', null)
                }
              }
            }
          },
          error => {
            ElementUI.Message({
              message: error.message,
              type: 'error'
            })
          }
      );
    },

    handleExpand(data) {
      if (!this.dwtree_expand_keys.includes(data.id)) {
        this.dwtree_expand_keys.push(data.id)
      }
    },
    handleCollapse(data) {
      if (this.dwtree_expand_keys.includes(data.id)) {
        this.dwtree_expand_keys.splice(this.dwtree_expand_keys.indexOf(data.id), 1)
      }
    },

    async currentchange2(nodedata, node) {
      this.gx = null;
      this.dwval = nodedata.id
      service.get('/gx/getlistbydw1', {params: {dwid: nodedata.id}}
      ).then(
          response => {
            if (response.data.code == 20000) {
              this.gxArr = response.data.data;
              this.load()
            } else {
              throw new Error(response.data.message)
            }
          }
      ).catch(
          error => {
            this.$message.error(error.message)
          }
      )
    },

    nodeclick(nodedata, node, com) {
    }
    ,

    filterNode() {

    }
    ,
    dwchange(dw) {


    }
    ,

    devtypechange(gxval) {
      this.load()
    }
    ,
    handleSelectionChange(selection) {
      // console.log(selection)
      // this.selectedRows = selection.map(row => row._row);
      this.selectedRows = selection
      // console.log(this.selectedRows)
    }
    ,

    handleSizeChange(val) {
      this.pageSize = val
      this.load()
    },
    handleCurrentChange(val) {
      this.currentPage = val
      this.load()
    },
    refreshAll() {
      for (let i = 0; i < this.tableData.length; i++) {
        this.refreshyewu(this.tableData[i])
      }
    },
    refreshSelectedyewu() {
      if (this.selectedRows.length == 0) {
        this.$message.error('请选择设备!')
        return
      }
      for (let i = 0; i < this.selectedRows.length; i++) {
        this.refreshyewu(this.selectedRows[i])
      }

    },
    refreshyewu(row) {
      // console.log(row.yewusel)
      row.valtype = null
      row.regtype = null
      row.bvalue = null
      row.nvalue = null
      row.getvalstate = null
      row.newnvalue = null
      row.newbvalue = false
      row.errormessage = null
      row.result = null
      row.isButtonDisabled = true

      if (!row.yewusel) {
        console.log("未选择")
        return
      }

      for (let i = 0; i < row.regList.length; i++) {
        if (row.yewusel == row.regList[i].id) {
          row.valtype = row.regList[i].regdatatp
          row.regtype = row.regList[i].regtype
        }
      }
      if (row.regtype == 0) {
        row.isButtonDisabled = false
      }
      if (row.regtype == 4) {
        row.isButtonDisabled = false
      }
      if (row.regtype == 1 || row.regtype == 0) {
        service.get('/dev/getBoolYewu',
            {params: {devid: row.id, regid: row.yewusel}})
            .then(response => {
                  if (response.data.code == 20000) {
                    row.bvalue = response.data.data
                    // this.$message.success(row.name + ": 操作成功"  )
                    // row.name = "dfd"
                  } else {
                    row.getvalstate = 1
                    // this.$message.error(row.name + ": " + response.data.message)
                  }
                }
            ).catch(error => {
              row.getvalstate = 1
              // this.$message.error(row.name + ": " + error.message)
            }
        )
      } else if (row.regtype == 3 || row.regtype == 4) {
        service.get('/dev/getNumberYewu',
            {params: {devid: row.id, regid: row.yewusel}})
            .then(response => {
                  if (response.data.code == 20000) {
                    row.nvalue = response.data.data
                    // row.name = "dfd"
                  } else {
                    row.getvalstate = 1
                    // this.$message.error(row.name + ": " + response.data.message)
                  }
                }
            ).catch(error => {
              row.getvalstate = 1
              // this.$message.error(row.name + ": " + error.message)
            }
        )
      }

    },
    sendBatchYewu() {
      // console.log("=============")
      if (this.selectedRows.length == 0) {
        this.$message.error('请选择设备!')
        return
      }
      for (let i = 0; i < this.selectedRows.length; i++) {
        this.sendyewu(this.selectedRows[i])
      }

    },
    sendyewu(row) {
      console.log(row.regtype)
      // row.valtype = null
      // row.regtype = null
      // row.bvalue = null
      // row.nvalue = null
      // row.newnvalue = null
      // row.newbvalue = false
      row.errormessage = null
      row.result = null

      if (row.yewusel == null) {
        this.$message.error(row.name + ": 未选择功能")
        return
      }


      if (row.regtype == 0) {//线圈
        if (row.newbvalue == null) {
          this.$message.error(row.name + ": 请输入新值")
          return
        }
        service.get('/dev/setBoolYewu',
            {params: {devid: row.id, regid: row.yewusel, bvalue: row.newbvalue}})
            .then(response => {
                  if (response.data.code == 20000) {
                    row.result = 0
                    row.bvalue = response.data.data
                    this.$message.success(row.name + ": 操作成功")
                  } else {
                    row.result = 1
                    row.errormessage = response.data.message
                    //操作结果错误信息闪烁
                    row.errmessageblink = true
                    setTimeout(() => {
                      row.errmessageblink = false
                    }, 3000)
                    this.$message.error(row.name + ": " + response.data.message)
                  }
                }
            ).catch(error => {
              row.result = 1
              row.errormessage = error.message
              //操作结果错误信息闪烁
              row.errmessageblink = true
              setTimeout(() => {
                row.errmessageblink = false
              }, 3000)
              this.$message.error(row.name + ": " + error.message)
            }
        )
      } else if (row.regtype == 4) {//holdingregister
        if (row.newnvalue == null) {
          this.$message.error(row.name + ": 请输入新值")
          //让input框获取焦点，并且边框闪烁3s
          let oldborder = this.$refs[row.id + row.name].$el.style.border
          this.$refs[row.id + row.name].$el.style.border = '1px solid red'
          row.inputerrblink = true
          setTimeout(() => {
            //这里的if判断是为了解决，当用户切换其他菜单时，这个组件会被销毁，那么该组件中的内容会被vue销毁，
            // 就会出现this.$refs[row.id + row.name]为undefined错误
            if (this.$refs[row.id + row.name]) {
              this.$refs[row.id + row.name].$el.style.border = oldborder
              row.inputerrblink = false
            }
          }, 3000)
          return
        }
        // if (!row.newnvalue.match(/^[0-9]+(.[0-9]+)?$/)) {
        if (!row.newnvalue.match(/^(\-|\+)?\d+(\.\d+)?$/)) {
          this.$message.error(row.name + ": 新值必须为数字")
          //让input框获取焦点，并且边框闪烁3s
          this.$refs[row.id + row.name].focus()
          this.$refs[row.id + row.name].select()
          let oldborder = this.$refs[row.id + row.name].$el.style.border
          this.$refs[row.id + row.name].$el.style.border = '1px solid red'
          row.inputerrblink = true
          setTimeout(() => {
            //这里的if判断是为了解决，当用户切换其他菜单时，这个组件会被销毁，那么该组件中的内容会被vue销毁，
            // 就会出现this.$refs[row.id + row.name]为undefined错误
            if (this.$refs[row.id + row.name]) {
              this.$refs[row.id + row.name].$el.style.border = oldborder
              row.inputerrblink = false
            }
          }, 3000)
          // let oldborder = this.$refs[row.id+row.name].$el.style.border
          // //边框红色闪烁2S
          // setTimeout(()=>{
          //   this.$refs[row.id+row.name].$el.style.border = "1px solid red"
          // },500)
          // setTimeout(()=>{
          //   this.$refs[row.id+row.name].$el.style.border = oldborder
          // },1000)
          // setTimeout(()=>{
          //   this.$refs[row.id+row.name].$el.style.border = "1px solid red"
          // },1500)
          // setTimeout(()=>{
          //   this.$refs[row.id+row.name].$el.style.border = oldborder
          // },2000)
          // this.$refs[row.id+row.name].$el.style.border = "1px solid red"
          return
        }
        service.get('/dev/setNumberYewu',
            {params: {devid: row.id, regid: row.yewusel, nvalue: row.newnvalue}})
            .then(response => {
                  if (response.data.code == 20000) {
                    row.result = 0 //0表示成功
                    row.nvalue = response.data.data
                    this.$message.success(row.name + ": 操作成功")
                  } else {
                    row.result = 1 //1表示失败
                    row.errormessage = response.data.message
                    //操作结果错误信息闪烁
                    row.errmessageblink = true
                    setTimeout(() => {
                      row.errmessageblink = false
                    }, 3000)
                    this.$message.error(row.name + ": " + response.data.message)
                  }
                }
            ).catch(error => {
              row.result = 1
              row.errormessage = error.message
              //操作结果错误信息闪烁
              row.errmessageblink = true
              setTimeout(() => {
                row.errmessageblink = false
              }, 3000)
              this.$message.error(row.name + ": " + error.message)
            }
        )

      }

    },
    showpop(row) {
      for (let i = 0; i < row.regList.length; i++) {
        row.regList[i].nvalue = null
        row.regList[i].bvalue = null
        if (row.regList[i].regtype == 1 || row.regList[i].regtype == 0) {
          //弹出pop错误全都不处理
          service.get('/dev/getBoolYewu',
              {params: {devid: row.id, regid: row.regList[i].id}})
              .then(response => {
                    if (response.data.code == 20000) {
                      row.regList[i].bvalue = response.data.data
                    } else {
                      // this.$message.error(row.name + ": " + response.data.message)
                    }
                  }
              ).catch(error => {
                // row.getvalstate = 1
                // this.$message.error(row.name + ": " + error.message)
              }
          )
        } else if (row.regList[i].regtype == 3 || row.regList[i].regtype == 4) {
          service.get('/dev/getNumberYewu',
              {params: {devid: row.id, regid: row.regList[i].id}})
              .then(response => {
                    if (response.data.code == 20000) {
                      row.regList[i].nvalue = response.data.data
                    } else {
                      // this.$message.error(row.name + ": " + response.data.message)
                    }
                  }
              ).catch(error => {
                // this.$message.error(row.name + ": " + error.message)
              }
          )
        }
      }
    },
    search() {
      // this.currentPage = 1
      this.load()
    },

    //======================下面函数淘汰========================淘汰========================================
    //======================下面函数淘汰========================淘汰========================================
    //======================下面函数淘汰========================淘汰========================================
    //======================下面函数淘汰========================淘汰========================================

    batchyewuChange(value) {
      // console.log(value)
      if (!value) {
        this.batchYewuForm.yewutypeid = null
        // this.batchYewuForm.yewutypeArr = []
        this.batchYewuForm.bVisible = false
        this.batchYewuForm.contentVisible = false
        this.batchYewuForm.content = ''
        this.batchYewuForm.bvalue = null
        this.tishi = ''
        return
      }
      // this.batchYewuForm.yewutypeid = value

      this.batchYewuForm.yewutypeArr.forEach(item => {
        if (item.id == value) {
          this.batchYewuForm.yewutypeid = item.id
          this.batchYewuForm.specialtypeObj = item
        }
      })
      if (this.batchYewuForm.yewutypeid != null) {
        if (this.batchYewuForm.specialtypeObj.funcode == 5) {
          this.tishi = '开关量(真/假)'
          this.batchYewuForm.bVisible = true
          this.batchYewuForm.contentVisible = false
        } else {
          if (this.batchYewuForm.specialtypeObj.funcode == 6) {
            this.tishi = '模拟量(-32768-32767)'
          } else if (this.batchYewuForm.specialtypeObj.funcode == 1005
              || this.batchYewuForm.specialtypeObj.funcode == 1007
              || this.batchYewuForm.specialtypeObj.funcode == 1025
          ) {
            this.tishi = '模拟量( -2147483648~2147483647)'
          } else if (this.batchYewuForm.specialtypeObj.funcode == 1008) {
            this.tishi = '模拟量(±1.4x10^-45至±3.8x10^38)'
          }
          this.batchYewuForm.bVisible = false
          this.batchYewuForm.contentVisible = true
        }
      }
      this.batchYewuForm.content = ''
      this.batchYewuForm.bvalue = false
    },
    yewuChange(value) {
      // console.log(value)
      if (!value) {
        this.YewuForm.yewuid = null
        this.YewuForm.specialtypeObj = null
        this.YewuForm.bVisible = false
        this.YewuForm.contentVisible = false
        this.YewuForm.content = ''
        this.YewuForm.bvalue = null
        this.tishi = ''
        return
      }
      for (let i = 0; i < this.YewuForm.yewuArr.length; i++) {
        if (this.YewuForm.yewuArr[i].id == value) {
          this.YewuForm.specialtypeObj = this.YewuForm.yewuArr[i].specialtypeObj
        }
      }
      if (this.YewuForm.specialtypeObj != null) {
        if (this.YewuForm.specialtypeObj.funcode == 5) {
          this.tishi = '开关量(真/假)'
          this.YewuForm.bVisible = true
          this.YewuForm.contentVisible = false
        } else {
          if (this.YewuForm.specialtypeObj.funcode == 6) {
            this.tishi = '模拟量(-32768-32767)'
          } else if (this.YewuForm.specialtypeObj.funcode == 1005
              || this.YewuForm.specialtypeObj.funcode == 1007
              || this.YewuForm.specialtypeObj.funcode == 1025
          ) {
            this.tishi = '模拟量( -2147483648~2147483647)'
          } else if (this.YewuForm.specialtypeObj.funcode == 1008) {
            this.tishi = '模拟量(±1.4x10^-45至±3.8x10^38)'
          }
          this.YewuForm.bVisible = false
          this.YewuForm.contentVisible = true
        }
      }
      this.YewuForm.content = ''
      this.YewuForm.bvalue = false
    },
    batchyewu() {
      if (this.batchYewuForm.yewutypeid == null) {
        this.$message.error('请选择业务类型!')
        return
      }
      if (this.batchYewuForm.specialtypeObj != null) {
        if (this.batchYewuForm.specialtypeObj.funcode == 5) {
          // bool值
          if (this.batchYewuForm.bvalue == null) {
            this.$message.error('请输入开关量业务内容!')
            return
          }
        } else if (this.batchYewuForm.specialtypeObj.funcode == 6

        ) {//short
          if (this.batchYewuForm.content == '') {
            this.$message.error('请输入模拟量业务内容!')
            return
          }
          if (!this.batchYewuForm.content.match(/^[0-9]+$/)) {
            this.$message.error('请输入整数!')
            return
          }
        } else if (this.batchYewuForm.specialtypeObj.funcode == 1005
            || this.batchYewuForm.specialtypeObj.funcode == 1007
            || this.batchYewuForm.specialtypeObj.funcode == 1025
        ) {//整数
          if (this.batchYewuForm.content == '') {
            this.$message.error('请输入模拟量业务内容!')
            return
          }
          if (!this.batchYewuForm.content.match(/^[0-9]+$/)) {
            this.$message.error('请输入整数!')
            return
          }
        } else if (this.batchYewuForm.specialtypeObj.funcode == 1008) {
          //实数
          if (this.batchYewuForm.content == '') {
            this.$message.error('请输入模拟量业务内容!')
            return
          }
          if (!this.batchYewuForm.content.match(/^[0-9]+\.?[0-9]*$/)) {
            this.$message.error('请输入实数!')
            return
          }
        }
      }

      let params = {
        devids: this.selectedRows.map(item => item.id),
        yewutypeid: this.batchYewuForm.yewutypeid,
        content: this.batchYewuForm.content,
        bvalue: this.batchYewuForm.bvalue
      }
      service.post('/dev/sendbatchyewu', params)
          .then(response => {
            if (response.data.code == 20000) {
              this.$message.success('发送业务成功!');
              // this.load()
            } else {
              this.$message.error(response.data.message)
            }
          })
    },
    yewuChange2(val) {
      console.log(val)
      //val是这一行的数据，包含这自己存入的用户选择的数据sel和val，bval
      for (let i = 0; i < val.regList.length; i++) {
        if (val.sel == val.regList[i].id) {
          if (val.regList[i].regdatatp == 1)
            val.isBoolYewu = true
          else
            val.isBoolYewu = false
        }
      }

    },
    // sendYewu(row) {
    //   console.log(row)
    //   let params = {
    //     devid: row.id,
    //     yewuid: row.sel,
    //     content: row.val,
    //     bvalue: row.bval
    //   }
    //   service.get('/dev/sendyewu', {
    //     params
    //   }).then(response => {
    //     if (response.data.code == 20000) {
    //       this.$message.success('发送业务成功!');
    //       // this.load()
    //     } else {
    //       this.$message.error(response.data.message)
    //     }
    //   })
    //
    // },
    yewu() {
      if (this.YewuForm.yewuid == null) {
        this.$message.error('请选择业务!')
        return
      }
      if (this.YewuForm.specialtypeObj != null) {
        if (this.YewuForm.specialtypeObj.funcode == 5) {
          // bool值
          if (this.YewuForm.bvalue == null) {
            this.$message.error('请输入开关量业务内容!')
            return
          }
        } else if (this.YewuForm.specialtypeObj.funcode == 6

        ) {//short
          if (this.YewuForm.content == '') {
            this.$message.error('请输入模拟量业务内容!')
            return
          }
          if (!this.YewuForm.content.match(/^[0-9]+$/)) {
            this.$message.error('请输入整数!')
            return
          }
        } else if (this.YewuForm.specialtypeObj.funcode == 1005
            || this.YewuForm.specialtypeObj.funcode == 1007
            || this.YewuForm.specialtypeObj.funcode == 1025
        ) {//整数
          if (this.YewuForm.content == '') {
            this.$message.error('请输入模拟量业务内容!')
            return
          }
          if (!this.YewuForm.content.match(/^[0-9]+$/)) {
            this.$message.error('请输入整数!')
            return
          }
        } else if (this.YewuForm.specialtypeObj.funcode == 1008) {
          //实数
          if (this.YewuForm.content == '') {
            this.$message.error('请输入模拟量业务内容!')
            return
          }
          if (!this.YewuForm.content.match(/^[0-9]+\.?[0-9]*$/)) {
            this.$message.error('请输入实数!')
            return
          }
        }
      }
      let params = {
        devid: this.YewuForm.devid,
        yewuid: this.YewuForm.yewuid,
        content: this.YewuForm.content,
        bvalue: this.YewuForm.bvalue
      }
      service.get('/dev/sendyewu', {
        params
      }).then(response => {
        if (response.data.code == 20000) {
          this.$message.success('发送业务成功!');
          // this.load()
        } else {
          this.$message.error(response.data.message)
        }
      })
    },

    showYewuForm(row) {
      this.YewuForm.devid = row.id
      service.get('/reg/getByDevidWithObj', {params: {devid: row.id}}).then(
          response => {
            if (response.data.code == 20000) {
              this.YewuForm.yewuArr = response.data.data;
              if (this.YewuForm.yewuArr.length > 0) {
                this.YewuForm.yewuid = this.YewuForm.yewuArr[0].id
              } else {
                this.YewuForm.yewuid = null
              }
              // this.YewuForm.yewuid = this.YewuForm.yewuArr[0].id
              this.yewuChange(this.YewuForm.yewuid)
              // this.YewuForm.content = null
              this.YewuFormVisible = true
            } else {
              this.$message.error(response.data.message)
            }
          }
      )
    }
    ,

    showBatchYewuForm() {
      if (this.selectedRows.length == 0) {
        this.$message.error('请选择设备!')
        return
      }
      for (let i = 1; i < this.selectedRows.length; i++) {
        if (this.selectedRows[i].devtype != this.selectedRows[0].devtype) {
          this.$message.error('请选择同一类型设备!')
          return
        }
      }
      // this.batchYewuForm.devid = this.selectedRows[0]
      service.get('/specialtype/getListBydevtypeid', {params: {devtypeid: this.selectedRows[0].devtypeObj.id}}).then(
          response => {
            if (response.data.code == 20000) {
              this.batchYewuForm.yewutypeArr = response.data.data;
              if (this.batchYewuForm.yewutypeArr.length > 0) {
                this.batchYewuForm.yewutypeid = this.batchYewuForm.yewutypeArr[0].id
              } else {
                this.batchYewuForm.yewutypeid = null
              }
              this.batchYewuForm.yewutyeid = this.batchYewuForm.yewutypeArr[0].id
              this.batchyewuChange(this.batchYewuForm.yewutypeid)
              // this.YewuForm.content = null
              this.batchYewuFormVisible = true
            } else {
              this.$message.error(response.data.message)
            }
          }
      )
    },

    // handleDelBatch() {
    //   console.log(this.$route)
    // },
    arraySpanMethod({row, column, rowIndex, columnIndex}) {
    }

  }
}
</script>

<style scoped>
/deep/ .el-tree-node__content {
  height: 40px;
}

/deep/ .el-tree-node__label {
  font: bold 16px/1.5 "Microsoft YaHei";
}

.blink-border {
  animation: borderblink-animation 1s linear infinite;
}

@keyframes borderblink-animation {
  0% {
    border-color: transparent;
  }
  50% {
    border-color: red;
  }
  100% {
    border-color: transparent;
  }
}

.blink-text {
  animation: textblink-animation 1s linear infinite;
}

@keyframes textblink-animation {
  0% {
    color: transparent;
  }
  50% {
    color: red;
  }
  100% {
    color: transparent;
  }
}


</style>
